<template>
  <div>
    <van-nav-bar title="列表" class="page-nav-bar" left-arrow  @click-left="$router.replace('/cate')"/>

    <van-tabs swipeable v-model="activeTabIndex" >
      <van-tab
        v-for="item in categoryList"
        :to="`/list/${item.id}`"
        :key="item.id"
        @click.native="indexid"
      >
        <template #title>
          <van-icon class-prefix="fa" :name="item.icon.replace('fa-', '')" />
          {{item.catename}}
        </template>
        <wenzhang v-for="qwe in lists" :key="qwe.id" 
        :title="qwe.title" 
        :pic="qwe.pic" 
        :lovenum="qwe.lovenum" 
        :click="qwe.click" 
        :id="qwe.id">
        </wenzhang>
      </van-tab>
    </van-tabs>
  </div>
</template>

<script>
import { mapState, mapActions } from "vuex";
import Wenzhang from "../comp/Wenzhang.vue";
import {leibiao} from '../api/listes'
export default {
  components: { Wenzhang },
  data() {
    return {
      lists:[],
       froms:{
        limit:30,
        page:1,
        cateid:''
      }
    };
  },
  methods: {
    ...mapActions(["getCategoryList"]),
    async wenzh(){
    try {
      this.froms.cateid = this.$route.params.cateid;
      // console.log(this.$route.params.cateid);
      let {data} =await leibiao(this.froms)
      console.log(data.data.list.data);
      this.lists=data.data.list.data
    } catch (error) {
      console.log(error);
    }
   },

  },
  computed: {
    activeTabIndex: {
      get() {
        return this.categoryList.findIndex(
          (item) => item.id === parseInt(this.$route.params.cateid),
          this.wenzh()
        );
        
      },
      set() {
      
      },
    },
    ...mapState(["categoryList"]),
  },
  created() {
    this.getCategoryList();
    this.wenzh()
  },
  
};
</script>

<style></style>
